import { reqVideoTags, reqVideoList, reqLike, reqSubscribe } from "../../request/video"
import type { VideoTagModel, VideoModel } from "../../request/video"
import { deBounce } from "../../utils/util"
import { hasLogin } from "../../utils/permission"

Page<DataModel, CustomOptionModel>({
  data: {
    groupId: 0, //视频列表分组：当前的标签id
    currentVid: "", //当前正在播放的视频的id
    tagList: [],
    videoList: [],
    hasmore: true, //本页后是否还有数据
    // type: 0, // 资源类型，用于点赞请求时的参数
    page: 0, //当前页
  },

  onLoad() {
    if (!hasLogin()) return

    getVideoTags.bind(this)()
  },

  onShow() {
    this.getTabBar().setData({
      currentPage: "video",
    })
    if (!hasLogin()) return
  },

  handleChangeTag(e) {
    const groupId = e.currentTarget.dataset.groupId
    this.setData({ groupId, page: 0, hasmore: true })
    getVideoList.bind(this)(groupId, 0) //每次切换页面获取都是从0开始
  },

  sending: false, //标记是否正在请求video数据

  async handleMoreVideo() {
    if (this.sending) return
    this.sending = true

    const page = this.data.page + 1

    this.setData({ page })

    await getVideoList.bind(this)(this.data.groupId, page)
    this.sending = false
  },

  handlePlay(e) {
    const vid = e.currentTarget.dataset.vid
    if (vid === this.data.currentVid) return
    //没用，还是阻止不了video销毁后的请求
    // wx.createVideoContext(this.data.currentVid).stop()
    this.setData({ currentVid: vid })
  },

  //关于收藏与点赞，在video列表请求中是带有收藏和点赞状态这两个字段的，但是收藏/点赞成功之后再请求数据还是false
  //接口有点不靠谱，因为即使是成功了，新数据没有改变，在手机客户端可以看到自己的点赞和收藏，但是零碎的，时有时无
  handleSubscribe(e) {
    const vid = e.currentTarget.dataset.vid
    let targetIndex!: number
    let subscribed!: boolean
    this.data.videoList.find((item, index) => {
      if (item.vid === vid) {
        targetIndex = index
        subscribed = item.subscribed
      }
      return false
    })

    const videoList = this.data.videoList
    videoList[targetIndex].subscribed = !subscribed

    this.setData({ videoList })

    //这里要的是vid这个视频id
    db_subscribe(vid, subscribed ? 0 : 1)
  },

  handlePraise(e) {
    const vid = e.currentTarget.dataset.vid
    let targetIndex!: number
    let praise!: boolean

    this.data.videoList.find((item, index) => {
      if (item.vid === vid) {
        targetIndex = index
        praise = item.praised
      }
      return false
    })

    const videoList = this.data.videoList
    videoList[targetIndex].praised = !praise

    this.setData({ videoList })
    // db_praise(threadId, this.data.type as any, praise ? 0 : 1)
    db_praise(vid, 5, praise ? 0 : 1)
  },

  onShareAppMessage(e) {
    if (e.from !== "button")
      return {
        title: "硅谷云音乐",
        path: "/pages/index/index",
      }

    const { title, url } = e.target.dataset

    return {
      title,
      path: "/pages/video/video",
      imageUrl: url,
    }
  },
})

async function getVideoTags(this: Instance) {
  const res = await reqVideoTags()
  const tagList = res.data.slice(0, 15)
  this.setData({ tagList, groupId: tagList[0].id })

  getVideoList.bind(this)(tagList[0].id, 0)
}

async function getVideoList(this: Instance, tagId: number, page: number) {
  const showTip = () => {
    wx.showToast({
      title: "这个分类已经没有更多视频啦~",
      icon: "none",
    })
  }

  if (!this.data.hasmore) {
    showTip()
    return
  }

  wx.showLoading({ title: "Loading..." })
  const { datas, hasmore } = await reqVideoList(tagId, page)
  if (datas.length === 0) {
    showTip()
    this.setData({ videoList: [] })
    return
  }
  const videoList = datas.map(item => item.data)
  page //如果page不是0的话，就不是替换而是在后面插入新的
    ? this.setData({ hasmore, videoList: [...this.data.videoList, ...videoList] })
    : this.setData({ hasmore, videoList })
  wx.hideLoading()
}

const db_praise = deBounce(reqLike, 500)

const db_subscribe = deBounce(reqSubscribe, 500)

interface DataModel {
  groupId: number
  currentVid: string
  tagList: VideoTagModel[]
  videoList: VideoModel[]
  hasmore: boolean

  page: number
}

interface CustomOptionModel {
  handleChangeTag: (e: WechatMiniprogram.TouchEvent) => void
  handleMoreVideo: () => void
  sending: boolean
  handleSubscribe: (e: WechatMiniprogram.TouchEvent) => void
  handlePraise: (e: WechatMiniprogram.TouchEvent) => void
  handlePlay: (e: WechatMiniprogram.TouchEvent) => void
}

type Instance = WechatMiniprogram.Page.Instance<DataModel, CustomOptionModel>
